<!-- 
   
   css介绍
      => 概念：层叠样式表或级联样式表
      => 作用：html 实现网页的内容
               css: 实现网页外观，用于美化网页
               
      => 语法:
              选择器{
                 样式名1：样式值1
                 样式名2：样式值2
              }
      => 小结: 学习css其实就是学习选择器和样式

    选择器
       => 选中html标签元素的方式
       => 选择器分类
          + 基础选择器
            - 标签选择器
            - ID选择器
            - class类选择器
          怎么选择基础选择器
             给不同标签设置相同样式使用class类选择器
             给相同标签设置样式，使用标签选择器
             给唯一确定的标签设置样式使用ID选择器
          + 层次选择器
             M   N    后代选择器:   选中M选择器下，名为N的所有后代选择器
             M > N
             M + N
             M ~ N

             M和N表示某个选择器

         
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>css</title>
    <!-- 在style标签中写样式 -->
    <style>
        p{
            color:red;
        }
        h1{
            color: blue;
        }
        /* #p1 表示： 选中id属性值为p1的标签元素 */
        #p1{
            /* font-size: 字体大小 */
            font-size: 28px;
        }

        #hh1{
            font-size: 16px;
        }

        /* .d1 表示： 选中class属性值为d1的标签元素 */
        .d1{
            background-color: green;
        }


    </style>
</head>
<body>
    <p id="p1">标签选择器p</p>
    <h1 id="hh1" class="d1">标签选择器h1</h1>
    <div class="d1">类选择器</div>
    <p>标签选择器</p>
</body>
</html>
